{layout '../Public/sideForm.latte'}
{block title}发布悬赏{/block}


{block private_css}
    <style>
        .priority-input{
            display:inline-block;
            width:35px;
            height:35px;
            line-height:35px;
            text-align:center;
            margin-right:15px;
            color:#fff !important;
            border:2px solid #fff;
        }

        .priority-input span{
            margin:auto !important;
            display:block;
            width:30px;
            height:30px;
            line-height:30px;
            border-radius:50%;
            cursor:pointer;
        }

        .priority-input input{
            display:none !important;
        }

        .priority-A span{
            background:#FB855C;
        }

        .priority-B span{
            background:#FFBA00;
        }

        .priority-C span{
            background:#305AAE;
        }

        .priority-D span{
            background:#5CABFB;
        }

        .priority-input.selected{
            font-weight:900 !important;
            border:2px solid #009DD9;
            background:#d7d7d7;
        }

        .medal-item{
            border:1px solid #ddd;
            display:inline-block;
            vertical-align:middle;
            min-width:80px;
            padding:3px 8px;
            margin-right:5px;
            height:35px;
            line-height:35px;
            text-align:center;
            cursor:pointer;
        }

        .medal-item img{
            width:30px;
            height:30px;
            vertical-align:middle;
        }

        .medal-item.medal-item-selected{
            border:2px solid #009DD9;
        }

        .acorn-item{
            width:90px;
            display:inline-block;
            margin-right:10px;
        }

        .acorn-item dt{
            text-align:center;
            font-size:14px;
            height:30px;
            line-height:30px;
        }

        .acorn-item dd input{
            width:100% !important;
            text-align:center;
            padding-left:0 !important;
        }

        .mform .control-group div.input-group select[disabled]{
            background-color:rgb(235, 235, 228);
        }

        .help-question{
            display:inline-block; width:15px;height:15px;line-height:15px;text-align:center;border-radius:50%;text-decoration:none;cursor:pointer;margin-left:5px;background:#ddd;color:#fff;
        }

        .help-question:hover{
            background:#bebebe;text-decoration:none;color:#fff;
        }

        .radiobox-input{
            display:inline-block;
            width:80px;
            height:30px;
            line-height:30px;
            text-align:center;
            margin-right:5px;
            color:#fff !important;
        }

        .radiobox-input span{
            margin:auto !important;
            display:block;
            width:80px;
            height:30px;
            line-height:30px;
            border-radius:30px;
            cursor:pointer;
            background:#5CABFB;
            border:2px solid #fff;
        }

        .radiobox-input input{
            display:none !important;
        }

        .radiobox-input.selected span{
            font-weight:900 !important;
            border:2px solid #d7d7d7;
            background:#30436e;
        }

    </style>
{/block}

{block private_js}
    {include 'addJs.latte'}
    <script>
        init.ready(function () {
            layer.tips("计时模型：按任务时间来计算积分<br>计件模型：按完成任务数量计算积分",".help-question");
            $(".priority-input").unbind().bind("click", function () {
                $(this).siblings(".selected").removeClass("selected");
                $(this).addClass("selected");
            });
            $(".radiobox-input").unbind().bind("click", function () {
                $(this).siblings(".selected").removeClass("selected");
                $(this).addClass("selected");
                var $val = $(this).attr("data-value");
                if ($val == 1) {
                    $("#workload_type_1").show();
                    $("#workload_type_2").hide();
                    $("#workload_2").attr("disabled", "disabled");
                    $("#workload").removeAttr("disabled");
                    $("#expressie_1").show();
                    $("#expressie_2").hide();
                } else {
                    $("#workload_type_2").show();
                    $("#workload_type_1").hide();
                    $("#workload").attr("disabled", "disabled");
                    $("#workload_2").removeAttr("disabled");
                    $("#expressie_2").show();
                    $("#expressie_1").hide();
                }
            });
            $("[name='standardTypes'][value='1']").trigger("click");
            $(".medal-item").unbind().bind("click", function () {
                $(this).siblings(".medal-item-selected").removeClass("medal-item-selected");
                $(this).addClass("medal-item-selected");
                var val = $(this).attr("data-val");
                $("#medal").val(val);
            });
            if (typeof window.timerdeadline !== "undefined") {
                clearInterval(window.timerdeadline);
            }
            window.timerdeadline = setInterval(function () {
                var endTimes = $("#deadline").val();
                var cTime = countDown(endTimes);
                $("#deadlineRemain").text("目前还剩下：" + cTime);
            }, 1000);

            $("#standardId").unbind().bind("change", function () {

                var selectedOption = $(this).find("option:selected");

                var val = selectedOption.attr("data-val");
                var workload = selectedOption.attr("data-workload");

                if (val != 0) {
                    $(".show-standard-acorn").text(val).show();
                    $(".expressie").hide();
                    if (!workload) {
                        $("#workload_day,#workload_hour,#workload_minute").removeAttr("disabled");
                    } else {
                        $("#workload_day,#workload_hour,#workload_minute").attr("disabled", true);
                        var workloads = workload.toString().split(",");
                        $("#workload_day").val(workloads[0]);
                        $("#workload_hour").val(workloads[1]);
                        $("#workload_minute").val(workloads[2]);
                        $("#workload").val(workload);
                    }
                } else {
                    $(".expressie").show();
                    $(".show-standard-acorn").hide();
                    $("#workload_day,#workload_hour,#workload_minute").removeAttr("disabled");
                }

            }).trigger("change");

            function setWorkload() {
                var day = $("#workload_day").val();
                var hour = $("#workload_hour").val();
                var minute = $("#workload_minute").val();
                var workload = [day, hour, minute].join(",");
                $("#workload").val(workload);
            }

            $("#workload_day,#workload_hour,#workload_minute").unbind().bind("change", function () {
                setWorkload();
            });

        });
    </script>
{/block}


{block content}
    <form id="formArticle" class="stdform mform" method="post" action="">
        <table cellpadding="0" cellspacing="0" border="0" id="frmtable" class="formtable">
            <thead>
            <tr>
                <td><label>任务名称</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            <input type="text" id="frm_names" name="names" class="smallinput" placeholder=""/>
                            <input type="hidden" name="pid" data-rel="pids">
                            <span class="set-group-name" id="pids">设置项目</span>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>优先级</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            {foreach $priorityMemo as $priority =>$priorityM}
                                <label class="priority-input priority-{$priorityM} {if $priority==$priorityDefault}selected{/if}">
                                    <span><input type="radio" name="priority" value="{$priority}" {if $priority==$priorityDefault}checked{/if}>{$priorityM}</span>
                                </label>
                            {/foreach}
                            <span style="color: #FB855C;">说明：A表示重要紧急的，有时效性要求，为最高优先级</span>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>验收人</label></td>
                <td>
                    <div class="field control-group">
                        {$accept|noescape}
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>人数</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            <input type="text" id="frm_nums" name="nums" class="smallinput"/>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>期限</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">

                            <input type="text" class="laydate" name="deadline" id="deadline" style="width: 180px;">
                            <span style="display: inline-block;vertical-align: bottom;padding: 5px 15px;margin-right: 15px;">之前</span>

                            <span style="display: inline-block;vertical-align: bottom;border:1px solid #D7D7D7 ;padding: 5px 15px;" id="deadlineRemain">目前还剩下: 0秒</span>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>外部人可见</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            <label class='radio'><input name='visibility' type="radio" value='1'>是</label>
                            <label class='radio'><input name='visibility' checked type="radio" value='0'>否</label>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>任务模型</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            <label class="radiobox-input" data-value="1"><span><input type="radio" name="standardTypes" value="1">计时模型</span></label>
                            <label class="radiobox-input" data-value="2"><span><input type="radio" name="standardTypes" value="2">计件模型</span></label>

                            {*<select name="standardId" id="standardId">*}
                                {*{foreach $standards as $s}*}
                                    {*<option data-workload="{$s["workload"]}" value="{$s["id"]}" {if $s["names"]=="任务执行"}selected{/if} data-val="{$s["acorn"]}">{$s["names"]}</option>*}
                                {*{/foreach}*}
                            {*</select>*}
                            <span class="help-question" target="_blank" href="">?</span>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>预估任务量</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group" id="workload_type_1">
                            <select id="workload_day">
                                {for $i=0;$i<16;$i++}
                                    <option value="{$i}">{$i}天</option>
                                {/for}
                            </select>

                            <select style="height:35px;padding-left:10px;width:80px" id="workload_hour">
                                {for $i=0;$i<8;$i++}
                                    <option value="{$i}">{$i}小时</option>
                                {/for}
                            </select>
                            <select style="height:35px;padding-left:10px;width:80px;margin-left:5px" id="workload_minute">
                                {for $i=0;$i<60;$i=$i+15}
                                    <option value="{$i}">{$i}分钟</option>
                                {/for}
                            </select>
                            <input name="workload" id="workload" value="" type="hidden">
                        </div>
                        <div class="input-group" id="workload_type_2">
                            <input style="width:100px" name="workload" id="workload_2" value=""> 单位个
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>积分</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            {*<input type="text" id="frm_acorn_1" class="smallinput" name="acorn[1]" value="{$acorns[0]}" style="width: 100px;"/> -*}
                            {*<input type="text" id="frm_acorn_2" class="smallinput" name="acorn[2]" value="{$acorns[1]}" style="width: 100px;"/>*}

                            <div class="expressie" id="expressie_1"> = 日基础分 &times; 难度系数 &times; 完成质量 &times; 任务量</div>
                            <div class="expressie" id="expressie_2"> = 每件基础分 &times; 件数 &times; 完成质量</div>
                            <div class="show-standard-acorn"></div>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>任务内容</label></td>
                <td>
                    <div class="field control-group">
                        <div class="input-group">
                            <textarea id="frm_content_pc" name="content" style="width: 600px; height: 250px"></textarea>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><label>图片/附件</label></td>
                <td>
                    <div class="field control-group">
                        <div class="img-uploader-file" data-name="thumbs" data-options="other"></div>
                    </div>
                </td>
            </tr>
            </thead>
        </table>
    </form>
{/block}